<!DOCTYPE html>
<html>
<head lang="zh-CN">
    <meta charset="UTF-8">
    <title>一键上传</title>
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <script type="text/javascript" src="/homepage/js/jquery.min.js"></script>
    <script>
        $(function() {
            $(".update-city").on("click", function(e) {
                e.preventDefault();

                var city_id = $(this).parent().parent().find("td:first").html();

                $.ajax({
                    type: 'post',
                    data: {
                        city_id: city_id
                    },
                    dataType: 'json',
                    success: function(res) {
                        if(res.ret == 0) {
                            $('.ret-info').html("更新成功了！<a href='#' onclick='location.reload()'>点此刷新</a>");
                            $(".ret-info").css("color", "green");
                        } else {
                            $(".ret-info").html(res.msg);
                            $(".ret-info").css("color", "red");
                        }
                        scroll(0, 0);
                    }
                });

            });

            $(".add-city").on("click", function(e) {
                e.preventDefault();
                var vals = $(".add-table input[type=text]");
                var city_id = $(vals[0]).val();
                var prov_id = $(vals[1]).val();
                var name = $(vals[2]).val();
                var cname = $(vals[3]).val();
                var pos_x = $(vals[4]).val();
                var pos_y = $(vals[5]).val();
                var version = $(vals[6]).val();
                var versioninfo = $(vals[7]).val();
                var bgcolortop = $(vals[8]).val();
                var bgcolorend = $(vals[9]).val();

                $.ajax({
                    'url': '/cityadd',
                    'type': 'post',
                    'dataType': 'json',
                    'data': {
                        city_id: city_id,
                        prov_id: prov_id,
                        cname: cname,
                        name: name,
                        pos_x: pos_x,
                        pos_y: pos_y,
                        version: version,
                        versioninfo: versioninfo,
                        bgcolortop: bgcolortop,
                        bgcolorend: bgcolorend
                    },
                    'success': function(res) {
                        if(res.ret == 0) {
                            $('.ret-info').html("奖励你一个大大的成功:),<a href='#' onclick='location.reload();'>点此刷新</a>。");
                            $(".ret-info").css("color", "green");
                        } else {
                            $(".ret-info").html(res.msg);
                            $(".ret-info").css("color", "red");
                        }
                    },
                    'fail': function(res) {
                    }
                })
            });
        });
    </script>
    <style>
        table{
            border-collapse:collapse;
        }
        .add-table input{
            width: 50px;
        }
        td{
            border: 1px solid #000000;
        }
    </style>
</head>
<body>
<div><h1 class="ret-info"></h1></div>
<div>
    <h2>已有城市</h2>
    <table class="info-table">
        <thead>
        <tr>
            <td>城市id</td>
            <td>省份id</td>
            <td>英文名称</td>
            <td>中文名称</td>
            <td>x轴坐标</td>
            <td>y轴坐标</td>
            <td>版本号</td>
            <td>版本信息</td>
            <td>顶端背景色</td>
            <td>底部背景色</td>
            <td>操作</td>
        </tr>
        </thead>
        <tbody>
        {% for city_info in city_info_list %}
            <tr>
                <td>{{ city_info['cityid'] }}</td>
                <td>{{ city_info['provid'] }}</td>
                <td>{{ city_info['name'] }}</td>
                <td>{{ city_info['cname'] }}</td>
                <td>{{ city_info['pos_x'] }}</td>
                <td>{{ city_info['pos_y'] }}</td>
                <td>{{ city_info['version'] }}</td>
                <td>{{ city_info['versioninfo'] }}</td>
                <td>{{ city_info['bgcolortop'] }}</td>
                <td>{{ city_info['bgcolorend'] }}</td>
                <td>
                    <button class="update-city" type="button">更新全部</button>
<!--                    <button class="update-city-map" type="button">更新地图</button>
                    <button class="update-city-cards" type="button">更新卡牌</button>
                    <button class="update-city-products" type="button">更新产品</button>-->
                </td>
            </tr>
        {% end %}
        </tbody>
    </table>
</div>
<div>
    <h2>新增城市</h2>
    <table class="add-table">
        <thead>
        <tr>
            <td>城市id</td>
            <td>省份id</td>
            <td>英文名称</td>
            <td>中文名称</td>
            <td>x轴坐标</td>
            <td>y轴坐标</td>
            <td>版本号</td>
            <td>版本信息</td>
            <td>顶端背景色</td>
            <td>底部背景色</td>
            <td>操作</td>
        </tr>
        </thead>
        <tbody>
            <tr>
                <td><input type="text"></td>
                <td><input type="text"></td>
                <td><input type="text"></td>
                <td><input type="text"></td>
                <td><input type="text"></td>
                <td><input type="text"></td>
                <td><input type="text"></td>
                <td><input type="text"></td>
                <td><input type="text"></td>
                <td><input type="text"></td>
                <td><button class="add-city" type="button">确认</button></td>
            </tr>
        </tbody>
    </table>
</div>
<div>
    <h2>已有城市更新使用说明</h2>
    <p>
    x,y坐标如果不知道可以填写0。<br>初始版本号和版本信息为0。<br>
    颜色为6位，后两位自动补ff，不为6位或8位则错误。
    </p>
</div>
</body>
</html>
